<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/style.css">
    <script src='script/jquery.js'></script>
</head>

<body>
    <header class='header'>
        <div class="content">
            <a href="/" class="logo">
                <img src="images/logo_3.png" alt="">
            </a>
            <nav class='shadow'>
                <ul>
                    <li>
                        <a href="index.php">首页</a>
                    </li>
                    <li class='active'>
                        <a href="usercenter.php">用户中心</a>
                    </li>
                    <li>
                        <a href="#">充值中心</a>
                    </li>
                    <li>
                        <a href="#">客服中心</a>
                    </li>

                </ul>
                <ul class='pull-right'>
                    <li class='search_box'>
                        <a href="" class='search_btn pull-left'></a>
                        <input class='search_input pull-left' type="text" placeholder="请输入漫画名/作者"></li>
                    <li class='pushlisher'>
                        <a href="">
                            <span class='icon'></span>我要投稿
                        </a>
                    </li>
                </ul>
            </nav>

        </div>
    </header>

    <div class="container">
        <div class="content clearfix">
            <div class="pull-left">
                <div class="menu">
                    <ul>
                        <li class='active'>我的收藏</li>
                        <li>观看历史</li>
                        <li>账户设置</li>
                    </ul>
                </div>

            </div>
            <div class="box pull-right mymark">
                <div class="gamecenter clearfix">
                    <header class="title">
                        我的收藏
                    </header>
                    <ul id="userTmpy">
                        <!-- 模板 -->
                    </ul>

                </div>
            </div>
        </div>
    </div>


    <footer class='footer content'>
        <ul>
            <li>
                <p>珠海布卡科技有限公司</p>
                <p>地址:珠海市香洲区夏美路161号(南厦丰泽园)2栋二层商铺234C</p>
            </li>
            <li>
                <p>客服:service@buka.cn</p>
                <p>投稿:td.sosobook.cn</p>
                <p>合作:bd@buka.cn</p>
            </li>
            <li>
                <p>电话:</p>
                <p>0756-3360306</p>
            </li>
            <li>
                ICP备案号:粤ICP备1234567号-1
            </li>
            <li>
                <span class="bkn"></span>
                <div class="qipao">
                    <span class="arrow"></span>
                    <p>沉迷娱乐伤身</p>

                    <p> 合理安排时间</p>

                    <p> 享受健康生活</p>

                    <p> 适龄17岁以上</p>
                </div>
            </li>
        </ul>
    </footer>
    <div id="mask">
        <div class="note">
            <p class="header">
                查看笔记 <span class='pull-right close'>X</span>
            </p>
            <textarea name="" id="" cols="66" rows="12"></textarea>
            <footer>
                <button>修改笔记</button>
                <button class='close'>关闭</button>
            </footer>
        </div>
    </div>
</body>
<script src='script/script.js'></script>
<script src="./script/template-web.js"></script>
<script src='js/usercenter.js'></script>

</html>
<script type="text/template" id="userTmp">
{{each data value index}}
<li>
    <a href='chapter.php?id="{{value.id}}"'>
    <img src="./images/{{value.pic}}" alt="{{value.bookName}}">
    <p class='bookname {{value.isStar == 1? "mark":""}}'>{{value.bookName}}</p>
    </a>
    <button>查看笔记</button>
</li>
{{/each}}
</script>
